<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '#' }">
        运动会基本信息设置
      </el-breadcrumb-item>
      <el-breadcrumb-item>
        <a href="#">设置竞赛基础信息</a>
      </el-breadcrumb-item>
    </el-breadcrumb>

    <el-card class="bos-card" v-show="bosbl">
      <el-form :model="basafrom" label-width="120">
        <el-form-item label="运动会名称：">
          <span>{{ basafrom.cname }}</span>
        </el-form-item>
      </el-form>
      <el-row>
        <el-col :span="12">
          <el-form :model="basafrom" label-width="120">
            <el-form-item label="第一泳道：">
              <span>{{ basafrom.sno }}</span>
            </el-form-item>
            <el-form-item label="泳池长度：">
              <span>{{ basafrom.poolsize }}</span>
            </el-form-item>
            <el-form-item label="开始日期：">
              <span>{{ basafrom.startdate }}</span>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="12">
          <el-form :model="basafrom" label-width="120">
            <el-form-item label="泳道数：">
              <span>{{ basafrom.lanes }}</span>
            </el-form-item>
            <el-form-item label="场数：">
              <span>{{ basafrom.chcnt }}</span>
            </el-form-item>
            <el-form-item label="天数：">
              <span>{{ basafrom.days }}</span>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
      <el-form :model="basafrom" label-width="120">
        <el-form-item label="活动形式：">
          <el-input type="textarea" v-model="basafrom.baocont" :disabled="disabled" rows="6"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="showidtbc">修 改</el-button>
      </div>
    </el-card>
    <el-card class="bos-card" v-show="!bosbl">
      <el-form :model="editfrom" label-width="120">
        <el-form-item label="运动会名称：">
          <el-input v-model="editfrom.cname"></el-input>
        </el-form-item>
      </el-form>
      <el-row>
        <el-col :span="12">
          <el-form :model="editfrom" label-width="120">
            <el-form-item label="第一泳道：">
              <el-input v-model="editfrom.sno"></el-input>
            </el-form-item>
            <el-form-item label="泳池长度：">
              <el-input v-model="editfrom.poolsize"></el-input>
            </el-form-item>
            <el-form-item label="开始日期：">
              <el-date-picker v-model="editfrom.startdate" value-format="YYYY-MM-DD" type="date" placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="12">
          <el-form :model="editfrom" label-width="120">
            <el-form-item label="泳道数：">
              <el-input v-model="editfrom.lanes"></el-input>
            </el-form-item>
            <el-form-item label="场数：">
              <el-input v-model="editfrom.chcnt"></el-input>
            </el-form-item>
            <el-form-item label="天数：">
              <el-input v-model="editfrom.days"></el-input>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
      <el-form :model="editfrom" label-width="120">
        <el-form-item label="活动形式：">
          <el-input type="textarea" v-model="editfrom.baocont" rows="6"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="info" @click="bcunmodify">取 消</el-button>
        <el-button type="primary" @click="bcverifi">确 定</el-button>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      bosbl: true,
      disabled: true,
      basafrom: {},
      editfrom: {},
    }
  },
  created() {
    this.getGamenameList();
  },
  methods: {
    bcunmodify() {
      this.bosbl = !this.bosbl
      this.getGamenameList();
    },
    // 获取数据
    showidtbc() {
      this.editfrom = this.basafrom
      this.bosbl = !this.bosbl
    },
    async bcverifi() {
      const result = await this.$http.post(this.BACKEND_URL + '/meeting/updateMsg', this.editfrom)
      if (result.data.code == 0) {
        window.location.reload();
        this.$message.success('修改成功')
      } else if (result.data.code == 500) {
        this.getGamenameList();
        this.$message.error(result.data.msg)
      }
    },
    // 查询数据
    async getGamenameList() {
      try {
        const result = await this.$http.post(this.BACKEND_URL + '/meeting/getmsg');
        if (result.data.code == 0) {
          this.basafrom = result.data.data
        } else if (result.data.code == 500) {
          console.log(result.data.msg)
        }
      } catch (error) {
        if (error === undefined) {
          this.$message.error('连接错误-数据获取失败');
        }
      }
    }
  }
}
</script>

<style lang="less" scoped>
.bos-card {
  margin-top: 15px;
}

// .grid-content{
//   color: #056C97;
// }</style>